{% load static %}
<div class="header-container fixed-top">
    <header class="header navbar navbar-expand-sm">
        <ul class="navbar-item theme-brand flex-row  text-center">
            <li class="nav-item theme-logo">
                <a href="{% url 'dashboardIndex' %}">
                    <img src="{% static 'img/logo.png' %}" class="navbar-logo" alt="logo">
                </a>
            </li>
            <li class="nav-item theme-text">
                <a href="{% url 'dashboardIndex' %}" class="nav-link"> reNgine </a>
            </li>
        </ul>
        <ul class="navbar-item flex-row ml-md-auto">
            <li class="nav-item dropdown user-profile-dropdown">
                <a href="javascript:void(0);" class="nav-link dropdown-toggle user" id="userProfileDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                    <svg id="Capa_1" enable-background="new 0 0 510 510" height="40" viewBox="0 0 510 510" width="40" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><linearGradient id="lg1"><stop offset="0" stop-color="#0b799d"/><stop offset="1" stop-color="#07485e"/></linearGradient><linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="255" x2="255" xlink:href="#lg1" y1="270.701" y2="34.898"/><linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="255" x2="255" y1="232.855" y2="144.039"><stop offset="0" stop-color="#07485e" stop-opacity="0"/><stop offset="1" stop-color="#03232e"/></linearGradient><linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="253.079" x2="253.079" y1="220.239" y2="122.466"><stop offset="0" stop-color="#ffdecf"/><stop offset="1" stop-color="#faa68e"/></linearGradient><linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="253.079" x2="253.079" y1="149.591" y2="278.824"><stop offset="0" stop-color="#faa68e" stop-opacity="0"/><stop offset="1" stop-color="#c9766e"/></linearGradient><linearGradient id="SVGID_5_" gradientUnits="userSpaceOnUse" x1="255" x2="255" y1="108.776" y2="273.787"><stop offset="0" stop-color="#07485e" stop-opacity="0"/><stop offset=".1225" stop-color="#0d5066" stop-opacity=".123"/><stop offset=".3102" stop-color="#1c657b" stop-opacity=".31"/><stop offset=".5394" stop-color="#35889e" stop-opacity=".539"/><stop offset=".799" stop-color="#58b8ce" stop-opacity=".799"/><stop offset="1" stop-color="#76e2f8"/></linearGradient><linearGradient id="lg2"><stop offset="0" stop-color="#b5dbff"/><stop offset="1" stop-color="#48b2e3"/></linearGradient><linearGradient id="SVGID_6_" gradientUnits="userSpaceOnUse" x1="255" x2="255" xlink:href="#lg2" y1="450.488" y2="531.935"/><linearGradient id="lg3"><stop offset="0" stop-color="#b5dbff" stop-opacity="0"/><stop offset=".1734" stop-color="#8fc5e9" stop-opacity=".173"/><stop offset=".4541" stop-color="#56a4c8" stop-opacity=".454"/><stop offset=".6955" stop-color="#2d8db1" stop-opacity=".696"/><stop offset=".8853" stop-color="#147ea2" stop-opacity=".885"/><stop offset="1" stop-color="#0b799d"/></linearGradient><linearGradient id="SVGID_7_" gradientUnits="userSpaceOnUse" x1="250.996" x2="279.243" xlink:href="#lg3" y1="461.932" y2="571.662"/><linearGradient id="SVGID_8_" gradientUnits="userSpaceOnUse" x1="182.08" x2="420.502" xlink:href="#lg2" y1="285.084" y2="523.506"/><linearGradient id="SVGID_9_" gradientUnits="userSpaceOnUse" x1="245.58" x2="282.217" y1="348.585" y2="385.222"><stop offset="0" stop-color="#edf5ff"/><stop offset="1" stop-color="#d5e8fe"/></linearGradient><linearGradient id="SVGID_10_" gradientUnits="userSpaceOnUse" x1="255" x2="255" xlink:href="#lg3" y1="420.311" y2="484.371"/><linearGradient id="SVGID_11_" gradientUnits="userSpaceOnUse" x1="152.583" x2="152.583" xlink:href="#lg2" y1="468.999" y2="485.678"/><linearGradient id="SVGID_12_" gradientUnits="userSpaceOnUse" x1="357.417" x2="357.417" xlink:href="#lg2" y1="468.999" y2="485.678"/><linearGradient id="SVGID_13_" gradientUnits="userSpaceOnUse" x1="202.485" x2="374.19" xlink:href="#lg1" y1="107.494" y2="279.199"/><g><ellipse cx="255" cy="216.429" fill="url(#SVGID_1_)" rx="155.929" ry="75.466"/><ellipse cx="255" cy="196.858" fill="url(#SVGID_2_)" rx="143.65" ry="95.038"/><g><path d="m253.079 265.238c-51.495 0-93.239-41.744-93.239-93.239v-69.456c0-51.494 41.744-93.239 93.239-93.239 51.494 0 93.239 41.745 93.239 93.239v69.457c0 51.494-41.744 93.238-93.239 93.238z" fill="url(#SVGID_3_)"/><path d="m258.376 205.338h-10.594c-8.49 0-15.104-7.364-14.195-15.804l5.539-51.487h27.907l5.539 51.487c.908 8.44-5.706 15.804-14.196 15.804z" fill="url(#SVGID_4_)"/></g><path d="m401.352 212.838c.02.22.048.439.065.659-2.978-118.668-67.39-213.497-146.417-213.497s-143.439 94.829-146.417 213.497c.016-.22.045-.439.065-.659-.108 1.19-.169 2.387-.169 3.591 0 41.679 65.6 75.466 146.521 75.466s146.521-33.787 146.521-75.466c0-1.204-.061-2.4-.169-3.591z" fill="url(#SVGID_5_)"/><g><g><g><path d="m53.329 461.66v13.248c0 6.13 2.74 11.939 7.47 15.838l16.396 13.516c4.5 3.71 10.151 5.738 15.983 5.738h323.643c5.832 0 11.483-2.029 15.983-5.738l16.396-13.516c4.73-3.899 7.47-9.708 7.47-15.838v-13.248c0-9.656-7.827-17.483-17.483-17.483h-368.375c-9.656 0-17.483 7.827-17.483 17.483z" fill="url(#SVGID_6_)"/><path d="m53.443 477.037c.556 5.33 3.177 10.265 7.356 13.709l16.396 13.516c4.5 3.71 10.151 5.738 15.983 5.738h323.643c5.832 0 11.483-2.029 15.983-5.738l16.396-13.516c4.178-3.444 6.8-8.38 7.356-13.709z" fill="url(#SVGID_7_)"/></g></g><g><path d="m422.175 471.759h-334.35c-12.937 0-23.424-10.487-23.424-23.424v-180.661c0-12.937 10.487-23.424 23.424-23.424h334.351c12.937 0 23.424 10.487 23.424 23.424v180.661c-.001 12.936-10.488 23.424-23.425 23.424z" fill="url(#SVGID_8_)"/><circle cx="255" cy="358.004" fill="url(#SVGID_9_)" r="35.66"/><path d="m64.401 388.225v60.862c0 12.521 10.835 22.672 24.201 22.672h332.796c13.366 0 24.201-10.15 24.201-22.672v-60.862z" fill="url(#SVGID_10_)"/></g><g><path d="m166.423 482.394h-27.68c-5.023 0-9.095-4.072-9.095-9.095v-3.559c0-5.023 4.072-9.095 9.095-9.095h27.68c5.023 0 9.095 4.072 9.095 9.095v3.559c0 5.023-4.072 9.095-9.095 9.095z" fill="url(#SVGID_11_)"/><path d="m371.257 482.394h-27.68c-5.023 0-9.095-4.072-9.095-9.095v-3.559c0-5.023 4.072-9.095 9.095-9.095h27.68c5.023 0 9.095 4.072 9.095 9.095v3.559c0 5.023-4.071 9.095-9.095 9.095z" fill="url(#SVGID_12_)"/></g></g><path d="m410.818 213.497c-3.189-40.32-71.727-72.535-155.818-72.535s-152.629 32.215-155.818 72.535c3.169-118.668 71.717-213.497 155.818-213.497s152.649 94.829 155.818 213.497z" fill="url(#SVGID_13_)"/></g></svg>
                </a>
                <div class="dropdown-menu position-absolute" aria-labelledby="userProfileDropdown">
                    <div class="">
                        <div class="dropdown-item">
                            <a class="" href="{% url 'profile' %}"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-user"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg> My Profile</a>
                        </div>
                        <div class="dropdown-item">
                            <a class="" href="{% url 'logout' %}"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-log-out"><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path><polyline points="16 17 21 12 16 7"></polyline><line x1="21" y1="12" x2="9" y2="12"></line></svg> Sign Out</a>
                        </div>
                    </div>
                </div>
            </li>

        </ul>
    </header>
</div>
